@charset "utf-8";

.banner-wrapper{
  position: relative;
  overflow: hidden;

  //banner
  .banner-main{
    position: relative;
    height:500px;

    //banner-list
    .list{
      position: absolute;
      top:0;
      left:0;
      width: 100%;
      height:100%;
      //transition:all 2s;
      img{
        display:block;
        width:100%;
        height:100%;
      }
    }
  }

  //banner-label
  .label{
    position:absolute;
    left:0;
    right:0;
    top:90%;
    text-align:center;
    z-index: 5;
    .label-list{
      border-radius:5px;
      display: inline-block;
      width: 10px;
      height: 10px;
      margin: 0px 2px;
      background-color:#ccc;
      &:hover{
        cursor: pointer;
      }
    }
  }

  //banner-left/right
  .left,.right{
    position: absolute;
    width: 60px;
    height: 60px;
    top:45%;
    text-align: center;
    line-height: 70px;
    z-index: 10;
    background: red;
    cursor: pointer;
    img{
      opacity:0.6;
      &:hover{
        opacity:0.8;
      }
    }
  }

  .left{
    left:40px;
  }
  .right{
    left:100%;
    margin-left:-100px;
  }


}